
<template>
    <div class="header">
        <h2>西部世界--xbsjUI</h2>
        <div class="header_right">
            <router-link to="/introduce">
                <div>指南</div>
            </router-link>
            <router-link to="/component">
                <div>组件</div>
            </router-link>
            <router-link to="/contribution">
                <div>贡献者</div>
            </router-link>
        </div>
    </div>
</template>

<script>
export default {
	components: {}
}
</script>

<style scoped>
.header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 1200px;
	height: 80px;
	margin: 0px auto;
	border-bottom: 1px solid #dcdfe6;
}
.header > h2 {
	color: #409eff;
}
.header_right {
	display: flex;
}
.header_right div {
	box-sizing: border-box;
	height: 80px;
	line-height: 80px;
}
a:hover {
	color: #1989fa;
}

a {
	color: #8cc4fc;
	text-decoration: none;
	margin: 0px 5px;
}

.router-link-active div {
	color: #1989fa;
	border-bottom: 2px solid #409eff;
}
</style>

